@import "./var.scss";

html,
body {
  @include full();
}
#app {
  @include full();
}

html #nprogress {
  .bar {
    height: 2px;
    background-image: linear-gradient(
      to right,
      red,
      orange,
      yellow,
      green,
      blue,
      indigo,
      violet
    );
  }
  .peg {
    height: 2px;
  }
}

li,
ul {
  list-style: none;
}
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}

img {
  border: none;
  line-height: 1;
  vertical-align: middle;
  max-width: 100%;
  height: auto;
}

html,
body {
  margin: 0px auto;
  box-sizing: border-box;
  line-height: 1.6;
  -webkit-text-size-adjust: none;
  margin: 0px auto;
  min-height: 100%;
  font: 14px Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif;
}

html {
  -webkit-text-size-adjust: none;
}
a {
  text-decoration: none;
  color: var(--ep-menu-text-color);
}

h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  font-weight: normal;
}

.imgs {
  overflow: hidden;
  line-height: 1;

  img {
    width: 100%;
    transition: all 0.7s;
    vertical-align: middle;
    height: auto;
  }

  &:hover img {
    transform: scale(1.05);
  }
}

.max-img {
  img {
    max-width: 100%;
    height: auto;
  }
}

.img {
  img {
    max-width: 100%;
    height: auto;
  }
}

.all-container {
  padding: 20px;
}

#app {
  background-color: var(--app-bg);
}

// 暂定先简单处理下100% 的table高度
:root {
  --container-pd: 20px;
  --body-height: calc(
    100vh - var(--xh-header-height) - var(--xh-tagview-height) -
      (var(--container-pd) * 2)
  );
  --body-table-height: calc(
    100vh - var(--xh-header-height) - var(--xh-tagview-height) -
      (var(--container-pd) * 4) - 125px
  );
}


.x-card {
  box-shadow: var(--#{$appNamespace}-card-shadow);
  border-radius: var(--#{$appNamespace}-card-radius);
  background-color: var(--#{$appNamespace}-card-bg-color);

  &-header {
    display: flex;

    .title {
      font-size: 24px;
      font-weight: 300;
      &[small] {
        font-size: 18px;
      }
    }
    &[border] {
      border-bottom: 1px solid #eee;
    }
  }
  &-body {
    margin-top: 20px;
  }
  &-search {
    margin-top: 10px;
    display: flex;
    align-items: center;
    &-item {
      display: flex;
      align-items: center;
      .label {
        white-space: nowrap;
        color: #666;
        margin-right: 8px;
      }
      &:nth-child(n + 2) {
        margin-left: 10px;
      }
    }
  }
}
.all-pd {
  padding: var(--#{$appNamespace}-all-pd);
}